<style lang="scss" scoped>
	.agreement-wrap {
		position: fixed;
		width: 100vw;
		height: 25vh;
		left: 0;
		bottom: 0;
		z-index: 3;
		background: rgba(255,255,255,.95);
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		.agreement-content {
			padding: 0 0 60upx;
			display: flex;
			align-items: center;
			box-sizing: border-box;
			font-size: 26upx;
		}
    .btn-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
    }
		.login-btn {
			background: #09bb07;
			color: white;
			border: 1px solid #ddd;
			border-radius: 10upx;
			width: 40vw;
			padding: 20upx 0;
			text-align: center;
			font-size: 32upx;
			line-height: 1;
			outline: none;
			box-sizing: border-box;

      &.blank {
        color: #09bb07;
        background: white;
        width: 20vw;
        border-color: currentColor;
        margin-right: 3vw;
      }
		}
		.link {
			text-decoration: underline;
		}
	}

</style>

<template>
	<view class="agreement-wrap" >
		<checkbox-group class="agreement-content" @change="checkbox_change">
				<checkbox value="1" color="#00ffff" :checked="checkbox_checked" />
				<view class="name">阅读<text class="link" @click="goAgreement('agreement')"> “用户使用协议” </text>和<text class="link" @click="goAgreement('privacy')"> “隐私政策” </text></view>
		</checkbox-group>
    <view class="btn-wrap">
      <view class="login-btn blank" @click="close">取消</view>
      <button  v-if="checkbox_checked" class="login-btn" open-type="getPhoneNumber" @getphonenumber="bindPhoneNumber">手机号快捷登录</button>
      <view v-else class="login-btn" @click="wx_login">手机号快捷登录</view>
    </view>
	</view>
</template>

<script setup>
	import api from '@/api'
	import { ref } from 'vue'
	import { useUserStore } from '@/stores/user'
	const user = useUserStore()

	const auth_ok = ref(false)
	const emits = defineEmits(['close'])
	const close = () => {
		emits('close',auth_ok.value)	//true代表授权完成 false代表取消授权
	}

	const bindPhoneNumber = async ({detail: {code}}) => {
		if(!code) return
		const { member_info } = await api.getPhone({code})
		uni.setStorageSync('member', member_info)
		user.setUser(member_info)
		auth_ok.value = true
    close()
	}

  const checkbox_checked = ref(false)
	const checkbox_change = ({detail: {value}}) => {
		checkbox_checked.value = value.length > 0
	}

	const wx_login = () => {
		uni.showToast({
			icon: 'none',
			title: '请先阅读用户使用协议并勾选',
			duration: 3000
		})
	}

	const goAgreement = type => {
		uni.navigateTo({
			url: `/pages/agreement/index?type=${type}`
		})
	}

	// const go_webview = index => {
	// 	let url = 'https://minikdapp.qddf.tech/UserAgreement.html'
	// 	if(index > 1) {
	// 		url = 'https://minikdapp.qddf.tech/privacyPolicy.html'
	// 	}
	// 	uni.navigateTo({
	// 		url: `/pages/webview/index?url=${url}`
	// 	})
	// }

</script>
